import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { Tabs } from 'antd';
import 'moment/locale/zh-cn';
import { FirstHeaderC } from '../../../../../../comps';
import TotalViewC from './totalViewC';
import YieldRiskC from './yieldRiskC';

const { TabPane } = Tabs;
const config = [
  {
    title: '总览',
    key: '1',
  },
  {
    title: '收益风险',
    key: '2',
  },
  // {
  //   title: '有效前沿',
  //   key: '3'
  // }
];
@connect(({ portfolioOptimizationM, loading }) => ({
  portfolioOptimizationM,
  loading,
}))
export default class ResultIndexC extends PureComponent {
  state = {
    tab: '1',
  };

  componentDidMount() {
    this.props.onRef(this);
  }

  componentWillUnmount() {
    // 离开前清除models数据
  }

  render() {
    const initComp = (key) => {
      if (key === '1') return <TotalViewC type={key} data={this.props.totalData} currentModel={this.props.currentModel} />;
      if (key === '2') return <YieldRiskC type={key} data={this.props.totalData} />;
      if (key === '3') return <a>{key}</a>;
    };

    return (
      <div style={{ position: 'relative', paddingBottom: '70px' }}>
        <FirstHeaderC title={'组合优化分析结果'} />
        <Tabs
          activeKey={this.state.tab}
          onChange={(val) => {
            this.setState({ tab: val });
          }}
        >
          {config.map((item) => {
            return (
              <TabPane tab={item.title} key={item.key}>
                {initComp(item.key)}
              </TabPane>
            );
          })}
        </Tabs>
      </div>
    );
  }
}
